thinkphp5 使用laravel-mix 安装admin-lte

接上篇博客tp5使用laravel-mix,安装完后,执行

npm install admin-lte --save-dev

安装完毕后将admin-lte startpage引入到布局文件中去,并引入app.css和app.js文件,然后再app.js中引入它所需的css文件和js文件,如下:

require('bootstrap');
require('admin-lte');

import 'admin-lte/dist/css/AdminLTE.css';
import 'admin-lte/dist/css/skins/_all-skins.css';

这里的require和import的基本路径就是/node_modules,这里admin-lte主体就引入完成了,然后还需要引入额外的字体和图标文件,直接引入CDN地址:

<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<link href="https://unpkg.com/ionicons@4.3.0/dist/css/ionicons.min.css" rel="stylesheet">

<script src="https://unpkg.com/ionicons@4.3.0/dist/ionicons.js"></script>

引入完后再引入app.css和app.js就可以了,但是由于诸多原因导致引入本地文件及其不顺利,无奈之下只好写了个函数方便引入静态资源:

function asset($url = '')
{
    return dirname($_SERVER['SCRIPT_NAME']). '/' . $url;
}

引入app.css就成了这样:

<link href="{:asset('css/app.css')}" rel="stylesheet">

这里根据不同的入口文件地址选择不同的写法。

到这里就ok了。

发表回复

您的电子邮箱地址不会被公开。